<template>
  <div>
    <a-card hoverable style="width: 100%">
      <div style="width: 100%;height: 250px; overflow: hidden;margin-bottom: 20px">
        <img
            slot="cover"
            alt="example"
            src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png"
            width="100%"
        />
      </div>
      <a-card-meta :title="this.nickname" :description="this.description">
        <a-avatar
            slot="avatar"
            :src="this.logo"
        />
      </a-card-meta>
    </a-card>
  </div>
</template>

<script>
import {getUserByName} from "@/request/api";

export default {
  created() {
    this.getUser()
  },
  data(){
    return{
      description: "This is the description",
      logo: "",
      nickname: localStorage.getItem("userName")
    }
  },
  methods:{
    getUser(){
      getUserByName({username: this.getNickName}).then(res=>{
        console.log(res)
        this.logo = res.logo
        this.description = res.signature
      })
    }
  },
  computed: {
    getNickName: function () {
      return this.nickname
    }
  }
}
</script>

<style scoped>

</style>